<template>
	<view style="display: flex; align-items: center; margin-left: 0.2rem;opacity: 1;">
		<view class="hs-box">
			<view class="detail">
				<view class="">
						<image src="../static/img/dot.png" mode="" class="dot"></image>
				</view>
				<view class="">
					<span>{{title[getIndex]}}</span>
				</view>
			</view>
			<view>
				<u-steps class="steps-class" current="0" dot direction="column" activeColor="#99DAE0"
					inactiveColor="#99DAE0" v-if="rcList.list">
					<u-steps-item desc="" class="" v-for="items in rcList.list[getIndex]"
						v-if="items.time!='' || items.title!=''">
						<view slot="icon" class="icon-hs">
							<img src="../static/img/slot.png" alt="" class="slot-icon" />
						</view>
						<view slot="desc" style="padding: 0 0 2rem 0" class="par" @click="hanleDetail(items)">
							<view style="display: flex; margin-bottom: 0.5rem">
								<view style="margin-right: 1rem; " class="time" v-if="items.time!=''">
									{{ items.time }}
								</view>
								<view style="" class="people-class" v-if="items.type==1">
									{{ items.title }}
								</view>
								<view style="font-size: 18px" v-else>
									{{ items.title }}
								</view>
							</view>
							<view class="xihuan" v-if="items.img && items.content">
								<view style="margin-bottom: 0.5rem">
									<text class="go_class">{{ items.content }}</text>
								</view>
								<img src="../static/img/fangdajing.png" alt="" class="fangdaj"
									@click="hanleDetail(items)" />
								<img :src="items.img" alt="" class="img_border" @click="hanleDetail(items)" />
							</view>
							<view class="go xihuan" v-else-if="items.img" @click="hanleDetail(items)">
								<img src="../static/img/fangdajing.png" alt="" class="fangdaj"
									v-if="items.title != '西部预制菜之都体验中心'" />
								<img :src="items.img" alt="" class="img_border" />
							</view>
							<view v-else>
								<view style="margin-bottom: 0.5rem">
									<text class="go_class">{{ items.content }}</text>
								</view>
							</view>
							<view class="bor"></view>
						</view>
					</u-steps-item>
				</u-steps>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		forEach
	} from 'neo-async';
	import {
		scheduleList
	} from '../api/fan';
	import q from '../static/img/1.jpg';
	import w from '../static/img/2.jpg';
	import e from '../static/img/3.jpg';
	import r from '../static/img/4.jpg';
	import t from '../static/img/5.jpg';
	import y from '../static/img/6.jpg';
	import z from '../static/img/7.jpg';
	export default {
		name: 'steps',
		// props: {
		// 	getIndex: Number
		// },
		props: ['getIndex'],
		data() {
			return {
				rcList: {},
				title:[]
			};
		},

		mounted() {
			let id = uni.getStorageSync("id")
			this.scheduleLists(id)
		},
		methods: {
			scheduleLists(id) {
				let that = this
				scheduleList(id).then(res => {
					that.rcList = res.data.data.schedule
					that.title = that.rcList.z_title
					// console.log(that.title)
					
					// console.log(that.rcList[0].list,'6+56')
					// console.log(that.rcList[1].list)
				})
			},
			hanleDetail(item, $event) {
				// console.log($event, 'event');
				// console.log(item, 'item');
				if (item.gm) {
					uni.navigateTo({
						url: '/pages/index/detail?id=' + item.gm
					})
				}

				// this.$store.commit('sen/updateAddress');
				// if (item.from == '到达预制菜之都体验中心') {
				// 	return;
				// }
				// uni.navigateTo({
				// 	url: '/pages/index/detail',
				// 	events: {
				// 		acceptDataFromOpenedPage: function(item) {
				// 			console.log(item);
				// 		}
				// 	},
				// 	success(res) {
				// 		res.eventChannel.emit('acceptDataFromOpenerPage', {
				// 			data: item
				// 		});
				// 	}
				// });
			},
			// previewImage(item) {
			// 	// console.log(item.img);
			// 	uni.previewImage({
			// 		urls: item.img
			// 	});
			// }
		}
	};
</script>

<style scoped lang="scss">
	.people-class {
		font-size: 25px;
		font-weight: 900;
		font-family: 'alimother';
		color: rgb(41, 64, 58)
	}

	.detail {
		display: flex;
		// align-items: center;
		.dot {
			width:35rpx;
			height: 35rpx;
			margin:10rpx 0 0 5rpx
		}
		span{
			font-size: 25px;
			font-weight: 900;
			font-family: 'alimother';
			color: rgb(41, 64, 58)
			}
	}


	.hs-title {
		font-size: 46rpx;
		font-weight: 700;
		padding: 20rpx 0 20rpx 30rpx;
	}

	.icon-hs {
		background-color: transparent
	}

	.hs-box {
		padding-right: 20rpx;
		border-radius: 30rpx !important;
		overflow: hidden;
	}

	.par {
		position: relative;
		margin-left: 10rpx;
		padding-right: 20rpx;
	}

	.bor {
		width: 100%;
		height: 3upx;
		background-color: #cce0da;
		border-radius: 20upx;
		position: absolute;
		bottom: 30upx;
	}

	.fangdaj {
		position: absolute;
		right: 28upx;
		bottom: 30upx;
		width: 40upx;
		height: 40upx;
	}

	.steps-class {
		margin-top: 20rpx;
	}

	.slot-icon {
		width: 41rpx;
		height: 41rpx;
		position: relative;
		top: 10rpx;
	}

	.xihuan {
		position: relative;
	}

	.img_border {
		width: 100%;
		height: 20%;
		border-radius: 10px;
	}

	.go_class {
		font-size: 16px;
		line-height: 1.8;
	}

	.time {
		font-family: 'alimother';
		font-size: 50rpx;
		font-weight: 900;
		color: rgb(41, 64, 58)
	}

	.who {
		margin: 1rem 0;
		font-size: 35upx;
	}
</style>